/**
 * Created by yuanqiujuan on 2017/9/19.
 */
$.fn.slide = function(options){
    var defaults = {
        el: ".y-slide",
        trigger: ".y-click",
        data: [
            {name: "menu1", link: "/sest"},
            {name: "menu2", link: "/sest"},
            {name: "menu3", link: "/sest"},
            {name: "menu4", link: "/sest"},
            {name: "menu5", link: "/sest"},
            {name: "menu", link: "/sest"}
        ]
    };

    options = $.extend(defaults, options);

    var slide = {
        render: function(){
            var li = "";

            options.data.forEach(function(o, i){
                li += '<li><a href="'+ o.link +'" >'+ o.name +'</a></li>'
            });

            $(options.el).append('<ul>' + li + "</ul>");
        },
        listen: function(){
            var el = $("body"),
                sideMove = false,
                isHalf = false,
                startX,
                isOpen = false;

            el.on("touchstart", function(e){
                startX = e.changedTouches[0].pageX;

                if(startX < 30){
                    sideMove = true
                }
            });

            el.on("touchmove", function(e){
                var moveX = e.changedTouches[0].pageX,
                    gap = 220 - moveX;

                isOpen = startX > moveX ? false : true;

                if(slide){
//                        var left = isOpen ? gap : - gap;

                    if(Math.abs(gap) > 220 / 2){
                        isHalf = true
                    }

                    if(isOpen && gap < 0){
                        return false
                    }

                    if(!isOpen && gap < -220){
                        return false
                    }

                    slide.setTransfrom(gap, "none");
                }
            });

            el.on("touchend", function(e){
                if(isHalf){
                    isOpen ?
                        slide.setTransfrom(0, "transform .5s") :
                        slide.setTransfrom(220, "transform .5s")
                }
            });

            $(options.trigger).on("touchend", function(){
                slide.setTransfrom(0, "transform .5s");
            })
        },
        setTransfrom: function(left, animate){
            $(options.el).css({
                "-webkit-transform": "translateX(" + -left + "px)",
                "-moz-transform": "translateX(" + -left + "px)",
                "-ms-transform": "translateX(" + -left + "px)",
                "-o-transform": "translateX(" + -left + "px)",
                "transform": "translateX(" + -left + "px)",
                "-webkit-transition": animate,
                "-moz-transition": animate,
                "-ms-transition": animate,
                "-o-transition": animate,
                "transition": animate
            })
        },
        init: function(){
            this.render();
            this.listen();
        }
    };

    slide.init()
};